<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/jquery-1.3.2.min.js"></script>
</head>
<body>
    <button id="btn1">获取一个用户信息</button>
    <button id="btn2">获取所有用户信息</button>
    <table border="1" width="500">
        <thead>
        <tr>
            <td>用户名</td>
            <td>密码</td>
            <td>年龄</td>
            <td>生日</td>
            <td>邮箱</td>
        </tr>
        </thead>
        <tbody>

        </tbody>
    </table>
</body>
<script>
    $("#btn1").click(function(){
       $.ajax({
           url:"json/getAUser",
           type:"post",
           dataType:'json',//设置 如何识别 后端发送给前端的数据格式  text->纯文本（json字符串）  json->(json对象)
           success:function(data){
               $("tbody").empty();
               console.log(data);
               let str = `<tr>
                            <td>${data.username}</td>
                            <td>${data.password}</td>
                            <td>${data.userAge}</td>
                            <td>${data.birthday}</td>
                            <td>${data.email}</td>
                           </tr>`;
               $("tbody").append(str);
           }
       })
    })

    $("#btn2").click(function(){
        $.ajax({
            url:"json/getUsers",
            type:"post",
            dataType:'json',//设置 如何识别 后端发送给前端的数据格式  text->纯文本（json字符串）  json->(json对象)
            success:function(data){
                $("tbody").empty();
                for(var i = 0;i<data.length;i++){
                    var user = data[i];
                    var str = `<tr>
                            <td>${user.username}</td>
                            <td>${user.password}</td>
                            <td>${user.userAge}</td>
                            <td>${user.birthday}</td>
                            <td>${user.email}</td>
                           </tr>`;
                    $("tbody").append(str);
                }
            }
        })
    })
</script>
</html>